<template>
  <div class="detailattribute">
    <div class="top">
        <div class="goods_attr_title">
            商品参数：
        </div>
    </div>
    <div class="goods_attr" v-for="item in GoodsAttrList" :key="item.id" >
        <p>名称：<span>{{item.name}}</span></p>
        <p>款式：<span>{{item.style}}</span></p>
        <p>商品编号：<span>{{item.commodity_number}}</span></p>
        <p>毛重：<span>{{item.gross_weight}}</span></p>
        <p>货号：<span>{{item.article_number}}</span></p>
        <div class="spell">
          <ul>
            <li>Open Switching along the seams and back yoke adds a</li>
            <li>delicately pretty touch to a lightweight silk shirtdress </li>
            <li>pajama-inspired tailoring</li>
          </ul>
        </div>
    </div>
  </div>
</template>

<script>
export default {
  name: 'DetailAttribute',
  props:{
    GoodsAttrList:Array
  },
  data () {
    return {
      
    }
  }
}
</script>


<style lang="stylus" scoped>
.detailattribute
    margin-top .15rem
    width 100%
    background-color #fff
    border 1px solid rgba(239,239,239,0.6)
    border-radius .2rem 
    .top
        height .8rem
        line-height .8rem
        border-bottom 1px solid #efefef
        .goods_attr_title
            font-size .36rem
            font-weight bold
            padding 0 .2rem
    .goods_attr
        width 100%
        margin-top .25rem 
        p
          width 100%
          font-size .32rem
          line-height .6rem
          font-weight bold
          padding-left .2rem
          position relative
          span 
              position absolute
              top 0
              left 30%
        .spell
             padding-left .2rem
             padding .2rem 0 .2rem .3rem
             ul li
                list-style disc
                margin-left .2rem
                font-size .26rem
                font-weight bold
                line-height .4rem
</style>
